<template>
  <section class="inner">
    <section class="inner-top">
      <span v-if="!tag">岗位管理</span>
      <div v-if="tag"><span class="detail-back" @click="back">岗位管理</span><span>></span><span>查看名单</span></div>
    </section>
    <section class="inner-bottom">
      <Role v-if="!tag" @check="checkDetail"></Role>
      <RoleList v-if="tag" :role="roleId"></RoleList>
    </section>
  </section>
</template>

<script>
import Role from './Role'
import RoleList from './RoleList'
export default {
  name: 'roleManagement',
  data () {
    return {
      tag: false,
      roleId: ''
    }
  },
  components: {
    Role: Role,
    RoleList: RoleList
  },
  methods: {
    back () {
      this.tag = false
    },
    checkDetail (id) {
      this.roleId = id
      this.tag = true
    },
    handleClick (tab, event) {
      console.log(tab, event)
    }
  }
}
</script>
